<template>
  <h2>这是一个子组件</h2>
  <h3>子组件接收到的钱：{{ money }}</h3>
  <button @click="btn(100)">花老爸100</button>
</template>

<script>
  export default {
    emits: ["change-money"],
    // 🔔 父传子一样通过 props 接收
    props: {
      money: {
        type: Number,
        default: 100,
      },
    },
    // 🔔 子传父通过 emit() 触发自定义事件，需在在第二个参数中解构出来 emit
    setup(props, { emit }) {
      // this.money
      const btn = (val) => {
        // this.$emit()
        // console.log("props", props);
        const temp = props.money - val;
        // console.log(temp);
        // 💥 触发父组件的自定义事件，用于实现父组件数据更新
        emit("change-money", temp);
      };
      return { btn };
    },
  };
</script>

<style>
</style>